<template>
    <div>
        <Form inline>
            <FormItem>
                <Input v-model="params.login_name" placeholder="搜索姓名"/>
            </FormItem>
            <FormItem>
                <Button type="success" @click="search">搜索</Button>
            </FormItem>
        </Form>
        <wl-resource-table @addAction="modalAdd" @editAction="edit" :params="params"
                           ref="wlTable" :addTitle="addTitle"></wl-resource-table>
        <wl-resource-form
                :show="modelFormShow"
                :options="filitionOption"
                @result="formResult"
                @cancelShow="cancelShow">
        </wl-resource-form>
    </div>
</template>

<script>
import WlResourceTable from './wl-resource-table/'
import WlResourceForm from '@/components/wl-resource-form/'

export default {
  components: { WlResourceForm, WlResourceTable },
  data () {
    return {
      params: {
        login_name: ''
      },
      modelFormShow: false,
      type: 'add',
      options: {
        // 表单属性 非必需
        formProps: {
          'label-width': 80
        },
        // 表单数据 必需
        formData: {
          id: '',
          scope: ''
        },
        // 表单项组件数据 必需
        formItem: [
          {
            type: 'input',
            label: '输入分数',
            key: 'scope',
            props: {
              placeholder: ''
            },
            rules: [{
              required: true,
              trigger: 'blur',
              message: '请输入分数'
            }]
          }
        ]
      }
    }
  },
  computed: {
    filitionOption () {
      return this.options
    },
    getUserInfo () {
      return this.$store.state.user.severUserInfo.data
    },
    addTitle () {
      let num = this.$store.state.user.severUserInfo.data.max_num
      if (num > 0) {
        return '新增(可以添加' + num + '个账号)'
      } else {
        return '新增'
      }
    }
  },
  mounted () {
  },
  methods: {
    search () {
      this.$refs.wlTable.getList()
    },
    formResult (data) {
      if (data.errcode === 1001) {
        this.type === 'add' ? this.$Message.success('新增成功！') : this.$Message.success('评分成功！')
        this.modelFormShow = false
        this.$refs.wlTable.getList()
      } else {
        this.$Message.success(data.errmsg)
      }
    },
    edit (row) {
      this.type = 'edit'
      this.options.formData = { id: row.id, scope: row.scope }
      this.modelFormShow = true
    },
    modalAdd () {
      this.type = 'add'
      let userInfo = this.getUserInfo
      if (userInfo.id > 1) {
        this.options.formData = {
          id: '',
          login_name: '',
          password: '',
          company_name: userInfo.company_name,
          industry: userInfo.industry,
          address: userInfo.address,
          main_product: userInfo.main_product
        }
      } else {
        this.options.formData = {
          id: '',
          login_name: '',
          password: '',
          company_name: '',
          industry: '',
          address: '',
          main_product: ''
        }
      }
      this.modelFormShow = true
    },
    cancelShow () {
      this.modelFormShow = false
    }
  }
}
</script>

<style scoped>
    .actionBtn {
        margin-right: 5px;
        margin-bottom: 5px;
    }

    .page {
        text-align: right;
        margin-top: 10px;
    }

    .input {
        width: 280px;
    }

</style>
